declare var $: any;

(function(global) {
  let counter = 0;
  let timeout: any;
  const preloader = <HTMLElement>document.querySelector('.preloader');
  const progressBar = <HTMLElement>document.querySelector('.preloader-progress-bar');
  const body = <HTMLElement>document.querySelector('body');
  body.style.overflow = 'hidden';
  timeout = setTimeout(startCounter, 20);
  global.appBootstrap = () => {
    setTimeout(endCounter, 1000);
  };
  function startCounter() {
    const remaining = 100 - counter;
    counter = counter + (0.015 * Math.pow(1 - Math.sqrt(remaining), 2));
    progressBar.style.width = Math.round(counter) + '%';
    timeout = setTimeout(startCounter, 20);
  }
  function endCounter() {
    clearTimeout(timeout);
    progressBar.style.width = '100%';
    setTimeout(function() {
      removePreloader();
      body.style.overflow = '';
    }, 300);
  }
  function removePreloader() {
    preloader.addEventListener('transitionend', () => {
      preloader.className = 'preloader-hidden';
    });
    preloader.className += ' preloader-hidden-add preloader-hidden-add-active';
  };
})((<any>window));
